<template>
	<view class="page-mobile" :style="deviceWidth ? { width: deviceWidth + 'px' } : ''">
		<!-- <view class="nav-logo"
			style="background: rgb(255, 255, 255); display: flex; justify-content: space-between; align-items: flex-end; position: relative;">
			<img class="logo-img" src="@/static/macaujc.png" />
			<span class="switch_style" @click="changeWinningStyle">切換開獎風格</span>
		</view> -->
		<view style="height: 0.213rem;">
		</view>
		<view class="lottery-tab">
			<view class="lottery-tab-item" v-for="item of tab" :key="item.value" @click="checktab(item)"
				:class="item.value==tabIndex?'active':''">
				<span>{{item.name}}</span>
			</view>
		</view>
		<view class="open-item-box">
			<view style="font-size: 0.427rem; display: flex; align-items: center;">
				第
				<p style="color: rgb(216, 0, 17); display: inline;">{{list[0].expect}}</p>
				期开奖号码
				<span class="huifang2" @click="imitate">模拟开奖</span>
			</view>
			<view style="height: 0.213rem;">
			</view>
			<view style="position: relative; overflow: hidden;">
				<view class="open_code_zone_left-content">
					<view class="open_code_zone_left-item"
						v-for="(item,index) of list[0].opencode.split(',').slice(0, 6)" :key="index">
						<view class="open_code_zone_left-item-number"
							:style="judgingStyle(list[0].wave.split(',')[index])">
							<span :style="winningStyle==3?'position: relative; top: 0px;':''">{{item}}</span>
						</view>
						<view class="open_code_zone_left-item-zodiac">
							<span>{{list[0].zodiac.split(',')[index]}}</span>
						</view>
					</view>
					<view class="open_code_zone_left-item">
						<view class="open_code_zone_left-item-plus">
							<span>+</span>
						</view>
						<view class="open_code_zone_left-item-zodiac">
							<span style="opacity: 0;">澳</span>
						</view>
					</view>
					<view class="open_code_zone_left-item">
						<view class="open_code_zone_left-item-number"
							:style="judgingStyle(list[0].wave.split(',')[list[0].wave.split(',').length-1])">
							<span>{{list[0].opencode.split(',')[list[0].opencode.split(',').length-1]}}</span>
						</view>
						<view class="open_code_zone_left-item-zodiac">
							<span
								:style="winningStyle==3?'position: relative; top: 0px;':''">{{list[0].zodiac.split(',')[list[0].zodiac.split(',').length-1]}}</span>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="open-item-expect">
			<view style="font-size: 0.373rem;" >
				下期截止时间 
				<!-- <p style="color: rgb(216, 0, 17); display: inline;">{{targetTimeStr}}</p> -->
				<p style="color: rgb(216, 0, 17); display: inline;">{{nextday}}</p>
			</view>
			<view style="height: 0.213rem;">
			</view>
			<view style="display: flex;align-items: center;justify-content: space-between;">
				<view class="" ></view>
				<view class="countdown" >
					<view class="countdown-item" style="margin-left: 0px;">
						{{ hoursTens }}
					</view>
					<view class="countdown-item">
						{{ hoursUnits }}
					</view>
					<view class="countdown-split">
						:
					</view>
					<view class="countdown-item" style="margin-left: 0px;">
						{{ minutesTens }}
					</view>
					<view class="countdown-item">
						{{ minutesUnits }}
					</view>
					<view class="countdown-split">
						:
					</view>
					<view class="countdown-item" style="margin-left: 0px;">
						{{ secondsTens }}
					</view>
					<view class="countdown-item">
						{{ secondsUnits }}
					</view>
				</view>
				<!-- <view class="drawdate">开奖日期</view> -->
				<!-- <picker @change="bindPickerChange" :value="index" mode="date" fields="year" >
					<view class="drawlabel">
						<view class="drawdate">开奖时间：{{hisTime}}</view>
						<image src="../../static/youbian.png" class="drawimg" mode=""></image>
					</view>

				</picker> -->

				<view>
					<picker mode="selector" :range="datearray" @change="datepicker" :value="dateindex">
						<view class="drawlabel">
							<view class="drawdate">开奖历史：{{hisTime}}</view>
							<image src="../../static/youbian.png" class="drawimg" mode=""></image>
						</view>

					</picker>
				</view>
			</view>
		</view>
		<view class="beijing_xuhua">
			<div class="position">
				<div class="position-item position-item1">
					位置
				</div>
				<div class="position-item" :class="positions.includes(item)?'back_red':''" @click="positionsAdd(item)"
					v-for="(item,index) of positionchose" :key="index">
					{{item}}
				</div>
				<div class="position-item position-item2" @click="positions=[]">
					还原
				</div>
			</div>
			<view style="height: 0.213rem;">
			</view>
			<div class="position">
				<div class="position-item position-item1">条件</div>
				<div class="position-item" :class="conditions.includes(item)?'back_red':''" @click="conditionsAdd(item)"
					v-for="(item,index) of conditionhose" :key="index">{{item}}
				</div>
				<div class="position-item position-item2" @click="conditions=[]">还原</div>
			</div>
		</view>
		<view style="height: 1px; background-color: rgb(161, 153, 153);">
		</view>
		<Prizeinfo :showlive="tabIndex" :lhcname="lhcname" :videoUrl="videoUrl" :showGGl="showGGl"
			:positions="positions" :conditions="conditions" :list="list" />
	</view>
</template>

<script>
	import Prizeinfo from '@/components/prizeinfo.vue'
	import {
		mapState,
		mapActions,
		mapGetters
	} from 'vuex'
	import {
		methods
	} from "../../uni_modules/uview-ui/libs/mixin/mixin"
	import {
		oldamhomeApi,
		oldamcodehomeApi,
		newamhomeApi,
		newamcodehomeApi,
		xghomeApi,
		getupxgDetadeil,
		gethkLott2
	} from "@/api/user.js"
	export default {
		data() {
			return {
				datearray: ['2023', '2024'],
				dateindex: 1,
				index: '',
				hisTime: new Date().getFullYear(),
				deviceWidth: null,
				showGGl: false,
				lhcname: '新澳門六合彩',
				videoUrl: 'https://vod.cctywlkj.com',
				tab: [{
						name: '新澳门六合彩',
						value: 1,
						videoUrl: 'https://vod.cctywlkj.com'
					},
					{
						name: '澳门六合彩',
						value: 2,
						videoUrl: 'https://video2m6-qq.dldydn.com'
					},
					{
						name: '香港六合彩',
						value: 3,
					}
				],
				timer: null,
				tabIndex: 1,
				list: [{
					"expect": null,
					"opencode": "正,在,进,行,搅,珠,中",
					"zodiac": "",
					"openTime": "",
					"wave": "#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc",
					"info": "數據來源macaujc.com"
				}],
				newData: [{
					"expect": null,
					"opencode": "正,在,进,行,搅,珠,中",
					"zodiac": "",
					"openTime": "",
					"wave": "#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc",
					"info": "數據來源macaujc.com"
				}],
				positionchose: ['平一', '平二', '平三', '平四', '平五', '平六', '特码'],
				conditionhose: ['鼠',
					'牛',
					'虎',
					'兔',
					'龙',
					'蛇',
					'马',
					'羊',
					'猴',
					'鸡',
					'狗',
					'猪'
				],
				targetTimeStr: '',
				positions: [],
				conditions: [],
				hoursTens: '0',
				hoursUnits: '0',
				minutesTens: '0',
				minutesUnits: '0',
				secondsTens: '0',
				secondsUnits: '0',
				times: {
					time: 0,
					divide: 0
				},
				nextday:'',

			}
		},
		components: {
			Prizeinfo
		},
		mounted() {
			this.getData()
			this.getDeviceWidth()
		},
		beforeDestroy() {
			clearInterval(this.timer);
			this.timer = null
		},
		computed: {
			...mapState(['winningStyle']),
			...mapGetters(['judgingStyle'])
		},
		methods: {
			...mapActions(['changeWinningStyle']),
			imitate() {
				this.updateBFromA(this.list[0])
			},
			updateBFromA(a, b) {
				this.isprize = false
				console.log(a);
				console.log(b);
				let newa = JSON.parse(JSON.stringify(a))
				// let newb = JSON.parse(JSON.stringify(b))
				let newb = {
					"issue": null,
					"opencode": "正,在,进,行,搅,珠,中",
					"zodiac": ", , , , , ,", // 这里是默认值
					"openTime": "",
					"wave": "#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc", // 这里是默认值
					"info": "數據來源macaujc.com"
				}
				// 分割 a.opencode 字符串
				let opencodes = newa.opencode.split(",");

				// 分割 b.opencode 字符串，作为初始状态
				let defaultCodes = newb.opencode.split(",");
				let zodiacCodes = newa.zodiac.split(",");
				let waveCodes = newa.wave.split(",");
				let index = 0;
				this.list[0] = newb
				this.intervalId = setInterval(() => {
					if (index < opencodes.length || index < zodiacCodes.length || index < waveCodes.length) {
						// 替换 opencode 的对应位置
						if (index < opencodes.length) {
							defaultCodes[index] = opencodes[index];
							newb.opencode = defaultCodes.join(",");
						}
						// 替换 zodiac 的对应位置
						if (index < zodiacCodes.length) {
							let defaultZodiac = newb.zodiac.split(",");
							defaultZodiac[index] = zodiacCodes[index]; // 覆盖默认值的部分
							newb.zodiac = defaultZodiac.join(",");
							console.log("Zodiac:", newb.zodiac); // 打印当前替换的结果
						}
						// 替换 wave 的对应位置
						if (index < waveCodes.length) {
							let wave_i = newb.wave.split(",");
							wave_i[index] = waveCodes[index]; // 覆盖默认值的部分
							newb.wave = wave_i.join(",");
							// newb.wave = waveCodes.slice(0, index + 1).join(",");
							console.log("Wave:", newb.wave); // 打印当前替换的结果
						}
						// 增加索引
						index++;
						console.log(newb, "newwb");
						// this.newData2[0] = newb
						// 每次替换后抛出 b 对象
						this.list[0] = newb // 直接用回调传递 b
					} else {
						// 完成所有替换后，清除定时器
						clearInterval(this.intervalId);
					}
				}, 1000);
				// this.updateCallback({
				// 	"expect": null,
				// 	"opencode": "正,在,进,行,搅,珠,中",
				// 	"zodiac": "",
				// 	"openTime": "",
				// 	"wave": "#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc",
				// 	"info": "數據來源macaujc.com"
				// })
			},
			checktab(e) {
				this.tabIndex = e.value
				this.videoUrl = e.videoUrl
				this.lhcname = e.name
				this.hisTime = new Date().getFullYear()
				this.list = [{
					"expect": null,
					"opencode": "正,在,进,行,搅,珠,中",
					"zodiac": "",
					"openTime": "",
					"wave": "#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc",
					"info": "數據來源macaujc.com"
				}]
				clearInterval(this.intervalId);
				this.getData()
			},
			addOneDay(dateString) {
				// 将输入的日期字符串转换为 Date 对象
				const date = new Date(dateString);

				// 给日期加上一天
				date.setDate(date.getDate() + 1);

				// 格式化为指定的日期格式 YYYY-MM-DD HH:mm:ss
				const year = date.getFullYear();
				const month = String(date.getMonth() + 1).padStart(2, '0');
				const day = String(date.getDate()).padStart(2, '0');
				const hours = String(date.getHours()).padStart(2, '0');
				const minutes = String(date.getMinutes()).padStart(2, '0');
				const seconds = String(date.getSeconds()).padStart(2, '0');

				return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
			},


			updateCountdown(index) {
				// 接收的时间格式是 '2024-09-19 21:34:00'
				
				let targetTimeStr = index==3?this.targetTimeStr:this.targetTimeStr
				// console.log(targetTimeStr);
				const targetTime = new Date(targetTimeStr);
				const now = new Date();
				// 如果传入的时间小于当前时间，返回 true
				// if (now > targetTime) {
				// 	return true; // 目标时间已过
				// }
				// 计算时间差
				const diff = targetTime - now;
				// 分别计算时、分、秒
				const hours = Math.floor(diff / (1000 * 60 * 60)) <0? 0	:Math.floor(diff / (1000 * 60 * 60))|| 0;
				const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60)) <0? 0:Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60))|| 0;
				const seconds = Math.floor((diff % (1000 * 60)) / 1000) <0? 0:Math.floor((diff % (1000 * 60)) / 1000)|| 0;
				this.hoursTens = Math.floor(hours / 10).toString();
				this.hoursUnits = (hours % 10).toString();
				this.minutesTens = Math.floor(minutes / 10).toString();
				this.minutesUnits = (minutes % 10).toString();
				this.secondsTens = Math.floor(seconds / 10).toString();
				this.secondsUnits = (seconds % 10).toString();
			},
			positionsAdd(e) {
				uni.showLoading()
				console.log(e, "eeeeeeeeee")
				if (this.positions.indexOf(e) != -1) {
					this.positions.splice(this.positions.indexOf(e), 1)
				} else {
					this.positions.push(e)
				}
				uni.hideLoading()
			},
			conditionsAdd(e) {
				console.log(e, "eeeeeeeeee")
				if (this.conditions.indexOf(e) != -1) {
					this.conditions.splice(this.conditions.indexOf(e), 1)
				} else {
					this.conditions.push(e)
				}
			},
			getDay(day) {
				var today = new Date();
				var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;
				today.setTime(targetday_milliseconds); //注意，这行是关键代码

				var tYear = today.getFullYear();
				var tMonth = today.getMonth();
				var tDate = today.getDate();
				tMonth = this.doHandleMonth(tMonth + 1);
				tDate = this.doHandleMonth(tDate);
				return tYear + "-" + tMonth + "-" + tDate;
			},
			doHandleMonth(month) {
				var m = month;
				if (month.toString().length == 1) {
					m = "0" + month;
				}
				return m;
			},
			// async getNewData() {
			// 	try {
			// 		if (this.tabIndex == 1) {
			// 			this.newData = await getXAMNewData()
			// 		}
			// 		if (this.tabIndex == 2) {
			// 			this.newData = await getAMNewData()
			// 		}
			// 		if (this.tabIndex == 3) {
			// 			let {
			// 				data
			// 			} = await get3NewData()
			// 			this.newData = data
			// 		}
			// 	} catch (e) {
			// 		//TODO handle the exception
			// 	}
			// },
			// async indexgetData() {
			// 	try {
			// 		// this.list = []
			// 		if (this.tabIndex == 1) {
			// 			this.times = {
			// 				time: 21,
			// 				divide: 25
			// 			}
			// 			this.updateCountdown();
			// 			let {
			// 				data
			// 			} = await getXAMHistory()
			// 			this.list = data
			// 		}
			// 		if (this.tabIndex == 2) {
			// 			this.times = {
			// 				time: 22,
			// 				divide: 25
			// 			}
			// 			this.updateCountdown();
			// 			let {
			// 				data
			// 			} = await getAMHistory()
			// 			this.list = data
			// 		}
			// 		if (this.tabIndex == 3) {
			// 			this.times = {
			// 				time: 23,
			// 				divide: 25
			// 			}
			// 			let {
			// 				data
			// 			} = await get3History({
			// 				"pageNo": 1,
			// 				"pageSize": 100
			// 			})
			// 			this.list = data.records
			// 		}
			// 		setInterval(this.updateCountdown, 1000);
			// 	} catch (e) {
			// 		//TODO handle the exception
			// 	}
			// },
			async getData() {
				try {
					uni.showLoading();
					
					// 默认空数据模板
					const emptyDataTemplate = {
						"expect": null,
						"opencode": "正,在,进,行,搅,珠,中",
						"zodiac": "",
						"openTime": "",
						"wave": "#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc,#cccccc",
						"info": "數據來源macaujc.com"
					};

					// 验证开奖号码格式
					const isValidOpencode = (opencode) => {
						const pattern = /^\d{2}(,\d{2}){6}$/;
						return pattern.test(opencode);
					}

					let result;
					
					// 根据不同tab获取数据
					switch(this.tabIndex) {
						case 1: // 新澳门
							result = await newamhomeApi({ year: this.hisTime });
							result = result.result;
							break;
						case 2: // 澳门
							result = await oldamhomeApi({ year: this.hisTime });
							result = result.result;
							break;
						case 3: // 香港
							result = await xghomeApi({ year: this.hisTime });
							// const timedata = await getupxgDetadeil();
							const next_issue = await gethkLott2()
							
							this.targetTimeStr =next_issue.data.nextTime;
							console.log(this.targetTimeStr,"this.targetTimeStr")
							result = result.result;
							break;
					}

					// 检查数据是否为空
					if (!result?.data?.length) {
						this.list = [emptyDataTemplate];
						return;
					}

					// 处理数据
					if (this.tabIndex !== 3) {
						// 新澳门和澳门的处理逻辑
						this.nextday = this.addOneDay(result.data[0].opentime);
						this.targetTimeStr = this.addOneDay(result.data[0].opentime);
						console.log(this.targetTimeStr,"this.targetTimeStr")
						// 过滤无效数据
						result.data = result.data.filter(item => isValidOpencode(item.opencode));
					}

					// 格式化数据
					this.list = result.data.map(i => this.codeArrinfo(i));

					// 更新倒计时
					this.updateCountdown(this.tabIndex);
					setInterval(() => this.updateCountdown(this.tabIndex), 1000);

				} catch (error) {
					console.error('获取数据失败:', error);
					this.list = [emptyDataTemplate];
				} finally {
					uni.hideLoading();
				}
			},
			addZeroIfNeeded(str) {
				// 首先检查字符串长度是否为1  
				if (str.length !== 1) {
					// 如果不是长度为1的字符串，直接返回原字符串或抛出错误（取决于你的需求）  
					return str; // 或者 throw new Error('Input must be a single digit string');  
				}

				// 接下来检查这个长度为1的字符串是否是一个数字字符  
				if (!/^\d$/.test(str)) {
					// 如果不是数字字符，直接返回原字符串或抛出错误  
					return str; // 或者 throw new Error('Input must be a digit string');  
				}

				// 如果字符串是长度为1的数字字符，则在其前面加'0'  
				return '0' + str;
			},
			codeArrinfo(arr) {
				// console.log(arr);
				let opencodeArray = arr.opencode.split(/\s*,\s*/)
				arr.zodiac = [];
				arr.wave = [];
				opencodeArray.forEach(item => {
					// console.log(this.addZeroIfNeeded(item))
					let ballInfo = this.$store.getters.getBallInfo(this.addZeroIfNeeded(item));
					if (ballInfo) {
						arr.zodiac.push(`${ballInfo.zodiac}/${ballInfo.line8}`);
						arr.wave.push(ballInfo.wave);
					}
				});
				arr.opencode = opencodeArray.join(',');
				arr.zodiac = arr.zodiac.join(',');
				arr.wave = arr.wave.join(',');
				if (!arr.expect) {
					arr.expect = arr.issue;
				}
				return arr;
			},
			getDeviceWidth() {
				const systemInfo = uni.getSystemInfoSync();
				const screenWidth = systemInfo.screenWidth;

				// 判断是否为PC设备
				if (screenWidth >= 768) {
					this.deviceWidth = 350; // 如果是PC，使用默认宽度350px
				} else {
					this.deviceWidth = null; // 如果是手机，使用实际屏幕宽度
				}
				console.log(this.deviceWidth);
			},
			bindPickerChange(e) {
				console.log(e);
				uni.showLoading({

				})
				// this.tabIndex  1 新澳门  2 澳门  3香港六合彩
				console.log(this.tabIndex);
				this.hisTime = e.detail.value
				this.getData()
			},
			datepicker(e) {
				console.log(e);
				this.hisTime = this.datearray[e.detail.value]
				this.getData()
			},
			// 修改格式化下一期开奖时间的方法
			formatNextIssueDate(dateStr) {
				try {
				if (!dateStr) return '';
				
				// 获取当前日期
				const currentDate = new Date();
				const year = currentDate.getFullYear();
				const month = currentDate.getMonth() + 1; // 获取当前月份
				const day = parseInt(dateStr);
				console.log( `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')} 21:30:00`,"dadadaadads")
				// 格式化日期字符串
				return `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')} 21:30:00`;
				
			} catch (error) {
				console.error('Error in getXGDay:', error, 'Input:', dateStr);
				return '';
			}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page-mobile {
		// height: 100%;
		box-sizing: border-box;
		height: 100vh;
		overflow-y: auto;
		overflow-x: hidden;
		margin: 0 auto;
	}

	.nav-logo {
		padding: 0 .107rem;
	}

	.logo-img {
		width: 2.24rem;
		height: 1.253rem;
	}


	.switch_style {
		display: inline-block;
		font-style: normal;
		border-radius: .107rem;
		padding: .053rem .107rem;
		color: #fff;
		background: #1a3d96;
		font-size: .347rem;
		text-align: center;
		line-height: .747rem;
		cursor: pointer;
	}

	.lottery-tab {
		display: flex;
		align-items: center;
		background-color: #fff;
	}

	.active {
		color: #1a3d96 !important;
		position: relative;
	}

	.active:after {
		content: "";
		display: block;
		position: absolute;
		width: 100%;
		height: .053rem;
		left: 0;
		bottom: 0;
		background-color: #1a3d96;
	}

	.lottery-tab-item {
		flex: 1;
		color: #333;
		font-weight: 700;
		height: .96rem;
		padding: 0 .053rem;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: .373rem;
		position: relative;
		box-sizing: border-box;
		overflow: hidden;
	}

	.open-item-box {
		border-top: .027rem solid #ddd;
	}

	.open-item-box,
	.open-item-expect {
		padding: .213rem .107rem;
		border-bottom: .027rem solid #ddd;
	}

	.huifang2 {
		display: inline-block;
		font-style: normal;
		border-radius: .693rem;
		color: #fff;
		background: #1a3d96;
		text-align: center;
		padding: 0 .4rem;
		font-size: .32rem;
		height: .507rem;
		line-height: .507rem;
		margin-left: .107rem;
	}

	.open_code_zone_left-content {
		display: flex;
		justify-content: space-between;
		padding: 0 .107rem;
	}

	.open_code_zone_left-item-number {
		width: 1.28rem;
		height: 1.28rem;
		background-color: #ccc;
		font-size: .587rem;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #000;
		font-family: PingFangSC-Regular, Microsoft YaHei, Helvetica, sans-serif !important;
	}

	.open_code_zone_left-item-zodiac {
		font-size: .427rem;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 700;
	}

	.open_code_zone_left-item-plus {
		height: 1.2rem;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: .427rem;
		color: #da0f1f;
		font-weight: bolder;
	}

	.open-item-expect {
		padding: .213rem .107rem;
		border-bottom: .027rem solid #ddd;
	}

	.countdown {
		display: flex;
		align-items: center;
	}

	.countdown-item {
		padding: .107rem .16rem;
		text-align: center;
		color: #000;
		font-weight: 500;
		background-color: #fff;
		border: .003rem solid #8c8585;
		border-radius: .053rem;
		margin-left: .107rem;
		font: .747rem Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
	}

	.countdown-split {
		font-size: .587rem;
		font-weight: 700;
		font-family: Microsoft JhengHei, Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Arial, sans-serif;
	}

	.beijing_xuhua {
		background-color: #f0f0f0;
		padding: .213rem .107rem;

		.position {
			display: flex;
			flex-wrap: wrap;
		}

		.position-item1 {
			background-color: #fff !important;
			color: #1a3d96 !important;
		}

		.position-item {
			border-radius: .16rem;
			cursor: pointer;
			font-size: .293rem;
			height: .32rem;
			line-height: .32rem;
			padding: .107rem;
			background: #ddd;
			margin-right: .107rem;
		}

		.position-item2 {
			color: #fff !important;
			background-color: #1a3d96 !important;
		}

		.back_red {
			background-color: #1a3d96 !important;
			color: #fff !important;
		}
	}

	.drawlabel {
		display: flex;
		align-items: center;
	}

	.drawdate {
		font-size: 30rpx;
		margin-right: 20rpx;
		color: #aaa;

	}

	.drawimg {
		width: 30rpx;
		height: 30rpx;
		transform: rotate(90deg);
		opacity: 0.5;
		margin-left: -10rpx;
	}
</style>